<template>
  <!--上传视频-->
  <a-spin :spinning="spinning" tip="加载中。。。">
  <span style="position: relative;">
    <input type="file" id="files" accept="video/*" @change="upVideo">
    <!--<audio id="audio_id" controls loop></audio>-->
    <a-button class="btnUp" @click="toUp" v-if="msg==''||msg==null"><a-icon type="upload"/>上传视频</a-button>
    <a-button class="btnUp" @click="toUp" v-else><a-icon type="upload"/>{{msg}}</a-button>
  </span>
  </a-spin>
</template>
<script>
  import {uploadVideo,livedelFile} from '@/api/courseManage/live'
  export default {
    inject: ['upShow'],
    props: {
      /*   -------弹窗--------*/
      msg: [String],
      id: [String],
    },
    data() {
        return {
          spinning: false
        }
    },
    created() {

    },
      methods: {
        toUp() {
            if(this.id != '' && this.id != null) {
                var that = this
              this.$confirm({
                title: '上传新的视频需要删除旧的视频',
                content: '确定删除'+this.msg +'?',
                onOk() {
                    that.delVideo()
                },
                onCancel() {},
              });
            }else {
              document.getElementById('files').click();
            }
        },
        delVideo() {
            this.spinning = true
          livedelFile(this.id).then(res => {
            this.spinning = false
            if(res.code == 200) {
              this.upShow(1,"旧视频删除成功")
              this.$emit('update:msg','')
              this.$emit('getVideoFile','')
              document.getElementById('files').click();
            }else {
              this.upShow(2,res.msg)
            }
          }).catch(err => {
            this.spinning = false
            this.upShow(2)
          })
        },
        upVideo() {
          this.spinning = true
          var file = document.getElementById('files').files[0];
          var url = URL.createObjectURL(file);
          console.log('url:'+url);
          let formData = new FormData();
          formData.append("file", file);
          uploadVideo(formData).then(res => {
            this.spinning = false
            if(res.code == 200) {
              this.upShow(1,"视频上传成功")
              this.$emit('update:msg',res.data.fileName)
              this.$emit('update:id',res.data.fileNo)
              if(res.data.filePeriod == 0) {
                res.data.filePeriod = 1;
              }
              this.$emit('getVideoFile',res.data)
//              获取视频时长
//              var videos =document.getElementById("audio_id")
//              videos.src = url;
//              setTimeout(function(){
//                if(videos.readyState>0){
//                  var minutes = parseInt(videos.duration / 60, 10);
//                  var seconds = videos.duration % 60;
//                  console.log('分钟:'+minutes)
//                  console.log('秒:'+seconds)
//                }
//              },500)
            } else {
              this.upShow(2,res.msg)
            }
          }).catch(err => {
            this.spinning = false
            this.upShow(2)
          })
        }
      }
  }
</script>
<style scoped="" lang="less">
  input {
    opacity: 0;
    width: 160px;
    height: 33px;
  }
  .btnUp {
    position: absolute;
    left: 0;
    top: 2px;
    width: 160px;
    height: 33px;
    font-size: 15px;
    span {
      display: inline-block;
      width: 100px;
      overflow: hidden;
      text-overflow:ellipsis;
      white-space: nowrap;
      vertical-align: middle;
    }
  }
</style>
